<!DOCTYPE html>
<html>
<!-- HEAD -->
<head>
	<title></title>
	
	<script src="../js/comm.js"></script>
	
    <style type="text/css"> 
		
		html, body {
				width: 100%;
				height: 100%;
				min-height: 100%;
				margin: 0;
                padding: 0;
		}
		
        [data-role="page"] {
                height: 90%;
				margin: 0;
                padding: 0;
        }
        
		div {
				border: red solid 0px;
				color: #000000;
			}
            
		table div {
				border: blue solid 1px;
        }
        
        .wrap {
              height: 100%;
		      margin: 0;
              padding: 0;
		}
		
		
		#result_wrap {
                min-height: 100%;
				height: 100%;
				width: 25%;
				float: right;
                position:relative;
		}
		
		#grid_wrap {
                height: 50%;
                position: inherit;
		}

		#btn_wrap {
                width: 100%;
				bottom: 0;
                position: absolute;
		}

		#btn_wrap ul {
                width: 100%;
                margin: 0;
                padding: 0;
		}

		#btn_wrap li{
                width: 47%;
                border: blue solid 2px;
                display: inline-block;
		}
        
		#item_wrap {
				height: 100%;
		}
        
        .item {
              width: 150px;
              height: 150px;
              background-color: #eee;
              margin: 15px;
              float: left;
        }
        
        
		
	</style>
</head>

<!-- BODY -->
<body>

	<div data-role="page">
        
        <!-- HEADER -->
	    <div id="navi" data-theme="a" data-role="header" data-position="fixed">
	        <h3>
                Work On
	        </h3>
            <a href="back" data-role="button" data-icon="back" class="ui--left">back</a> 
            <a href="setup" data-role="button" data-icon="star" class="ui-btn-right">setup</a> 
	    </div>
	    
	    <div data-role="content" class="wrap">
	        
		        <div id="result_wrap">
		            
                    <ul>
                        <li style="display:inline">Yi Sanghoon</li>
                        <li style="display:inline">   2013.01.24</li>
                    </ul>
		            
		            <!-- grid -->
					<div id="grid_wrap">
                    
                        <!-- 
                            #ITEM##QTY##PRICE##AMOUNT############
                            #####################################
                            #####################################
                            #####################################
                            #####################################
                         -->

                        <table id="grid" style="border: green solid 1px"></table>
                    
                    </div>
		            
                    <!-- button -->
		            <div id="btn_wrap">
                        <ul>
    		                <li><a data-role="button" id="reset">Reset</a></li>
    		                <li><a data-role="button" id="confirm">Confirm</a></li>
                        </ul>
                    </div>
		        </div>
		        
		        <!-- menu -->
		        <div id="items_wrap">
                    
                    <!-- 
                        APPEND ITEM

                        ####   ####   ####   ####   ####   ####   
                        ####   ####   ####   ####   ####   ####   

                        ####   ####   ####   ####   ####   ####   
                        ####   ####   ####   ####   ####   ####   

                        ####   ####   ####   ####   ####   ####   
                        ####   ####   ####   ####   ####   ####   
                     -->
                     
                </div>
	     
	    </div>
	    
	</div>
	
	

</body>

</html>